<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>My JSP 'list.jsp' starting page</title>
    
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<script>
          window.onload = function(){
              var otadb = document.getElementById('osd');
              var oblocolo =''; 
              for(var i=0;i<otadb.tBodies[0].rows.length;i++){
                  //下面是鼠标移到表格上时整行背景变色，当鼠标离开时整行背景回到原来的颜色；
                  otadb.tBodies[0].rows[i].onmouseenter = function(){
                      oblocolo=this.style.backgroundColor;
                      this.style.backgroundColor = '#F09';
                  };
                  otadb.tBodies[0].rows[i].onmouseout = function(){
                      this.style.backgroundColor =oblocolo;
                  }
                  
                  //下面的代码是背景隔行变色
                  if(i % 2 == 0){
                      otadb.tBodies[0].rows[i].style.backgroundColor = '#ccc';
                  }
                  else{
                      otadb.tBodies[0].rows[i].style.backgroundColor = '';
                      
                  }
              };
          };
        </script>

  </head>
  
  <body><center>
  <a href="/blog/form">增加</a>
    <table id="osd" border="1" cellpadding="10" cellspacing="0" >
    	<thead>
    	<th>序号</th><th>ID</th><th>标题</th><th>性别</th><th>内容</th><th>操作</th>
    	</thead>
    	<tbody>
    	<c:forEach items="${blogs }" var="blog" varStatus="xid">
    	<tr  >
    	<td>${xid.count }</td>
    	<td>${blog.id }</td>
    	<td>${blog.title }</td>
    	<td>${blog.sex==1?'男':'女' }</td>
    	<td>${blog.content }</td>
    	<td><a href="/blog/edit/${blog.id }">修改</a>-<a href="/blog/del/${blog.id }">删除</a></td>
    	</tr>
    	</c:forEach>
    	</tbody>
    </table>
  </center></body>
</html>
